//2022-11-01
//guanf add
//登录用户界面
import axios from 'axios';
import React from 'react';
import '../css/Login.css'
import { useNavigate } from 'react-router-dom' // eslint-disable-line no-unused-vars
import storage from '../Utils/storage'

//创建函数式方法
function Login() {

    //定义路由变量
    const navigate = useNavigate()

    //创建提交方法
    const handleSubmit = event =>{
        event.preventDefault();
        //编辑头文件，通过头文件解决跨域问题
        let config = {headers:{'Content-Type': 'application/json'},withCredentials:true}
        //进行后台请求
        axios({
            method: 'post',
            url:'http://localhost/mall-basic-service/login/jwt/login/login',
            params:{
                username: event.target.username.value,
                password: event.target.password.value
            }
        },config).then((response)=>{ debugger
            //登录成功
            const code = response.data.code
            if(code === 200){
                //先删除
                storage.remove("token")
                //重新复制
                storage.set("token",response.data);

                console.log('response.data--->',response.data)
                navigate('/home',{
                    state:{ nickname :response.data}
                })
                window.location.reload()
            }
        }).catch(function (error) {
        })
    };

    return (
        <div className="loginDiv" >
            <h2>用户登录界面</h2>
            <form onSubmit={handleSubmit}>
                <label >
                    用户名：<input type="text" id="username" name="username"/>
                </label>
                <br/>
                <label >
                    密&emsp;码：<input type="password" id="password" name="password"/>
                </label>
                <br/>
                <button type="submit" className="btn btn-primary"> 登录 </button> &emsp;
                <button type="reset" className="btn btn-primary"> 重置 </button>
            </form>

        </div>
    );
}

// &emsp; 全角的空格
// &ensp; 半角的空格
// &nbsp; 半角的不断行的空格
export default Login;
